<!DOCTYPE html>
<html lang="zh-CN">
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no">
	<meta name="author" content="Auelnce,aulence@foxmail.com">
	<title>axios.js基本使用</title>
	<link rel="shortcut icon" href="../img/favicon.ico">
    <link rel="bookmark" href="../img/favicon.ico">
    <link rel="stylesheet" href="../plugin/bootstrap.min.css">
    <link rel="stylesheet" href="../css/common.css">
</head>
<body>
    <nav>
        <ul class="breadcrumb">
            <li><a href="../index.html">首页</a></li>
            <li class="active">axios.js基本使用</li>
        </ul>
    </nav>

    <!-- 为什么要使用Axios.js，它有什么优势？ -->
    <!-- 1. 较高的社区活跃度。它在github上星数比JS三大框架之一的angular还要高，且还在继续上升中 -->
    <!-- 2. 无任何依赖。不需对任何库和框架进行依赖，任何Web项目都能直接使用 -->
    <!-- 3. 完善的功能。包含创建和修改日期等实用信息 -->
    <!-- 4. 支持并发请求。同时请求几个接口，然后依次处理 -->
    <!-- 5. 和现在主流的AJAX插件一样，支持promise模式（一个保留异步特性但能有序处理请求结果的对象） -->
    <!-- 6. GitHub上完善的使用文档 -->
    <!-- 7. 受到技术大牛的推荐。如Vue.js作者尤雨溪 -->

    <main>
        <h1>axios.js基本使用</h1>

        <section>
            <h2>Axios使用GET请求HTML文档</h2>
            <button type="button" id="loadAnimalData">加载数据</button>
            <div id="animalData"></div>
        </section>
        <section>
            <h2>Axios使用GET请求JSON数据</h2>
            <button type="button" id="loadTeaInfo">加载数据</button>
            <ul id="teaInfo"></ul>
        </section>
    </main>

	<script src="../plugin/axios.min.js"></script>
	<script src="../js/axios-base.js"></script>
</body>
</html>